<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0" maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/shopcart.css">
    <title>index</title>
</head>
<body>
    <div class="container">
        <div class="part part3">
            <div class="header">
                <h4 id="shopcart">购物车</h4>
                <span>管理</span>
            </div>
            <div class="count">
                <p>共 <i>2</i> 件商品</p>
            </div>
            <div class="product_list">
                <div class="item">
                    <div class="check">
                        <img src="./images/shopcart_check.png" data-check='true'>
                    </div>
                    <div class="goods">
                        <img src="./images/shopcart_goods1.png" alt="">
                    </div>
                    <div class="right">
                        <div class="text">
                            依泉润唇膏套装 保湿滋润补水无色防干裂 唇部护理唇膜淡化唇纹护唇膏... 
                        </div>
                        <div class="howmuch">
                            <div class="left">8g/ml</div>
                            <div class="right">
                                <img src="./images/shopcart_drop.png" alt="">
                            </div>
                        </div>
                        <div class="msg">
                            <p><small>￥</small><i class="price">98.9</i></p>
                            <div class="var">
                                <div class="min">-</div>
                                <div class="shu">1</div>
                                <div class="add">+</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="item">
                    <div class="check">
                        <img src="./images/shopcart_checked.png" data-check=''>
                    </div>
                    <div class="goods">
                        <img src="./images/shopcart_goods2.png" alt="">
                    </div>
                    <div class="right">
                        <div class="text">
                            专柜正品YSL圣罗兰口红方管迷魅纯漾亮采唇膏
                        </div>
                        <div class="howmuch">
                            <div class="left">1#正红色</div>
                            <div class="right">
                                <img src="./images/shopcart_drop.png" alt="">
                            </div>
                        </div>
                        <div class="msg">
                            <p><small>￥</small><i class="price">138.0</i></p>
                            <div class="var">
                                <div class="min">-</div>
                                <div class="shu">1</div>
                                <div class="add">+</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="finish">
                <div class="choice check">
                    <img src="./images/shopcart_checked.png" data-check=''>
                    <p>全选</p>
                </div>
                <div class="pay admin">
                    <p>合计 : <small>￥</small><span class="totleprice">98.9</span></p>
                    <a href="javascript:;" id="overpay">结 算</a>
                </div>
                <div class="update admin">
                    <div class="collect">
                        <img src="./images/shopcart_collect.png" alt="">
                        <a href="javascript:;">移入收藏夹</a>
                    </div>
                    <div class="delete">
                        <img src="./images/shopcart_delete.png" alt="">
                        <a href="javascript:;">删除</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <footer>
        <div class="footer">
            <div class="item active">
                <a href="./index.html"><img src="./images/index_footer11.png" alt=""></a>
                <p><a href="./index.html">主页</a></p>
            </div>
            <div class="item">
                <a href="./classify.html"><img src="./images/index_footer21.png" alt=""></a>
                <p><a href="./classify.html">分类</a></p>
            </div>
            <div class="item">
                <a href="./shopcart.html"><img src="./images/index_footer31.png" alt=""></a>
                <p><a href="./shopcart.html">购物车</a></p>
            </div>
            <div class="item">
                <a href="./usercenter.html"><img src="./images/index_footer41.png" alt=""></a>
                <p><a href="./usercenter.html">我的</a></p>
            </div>
        </div>
    </footer>
    

    <script src="./js/rem.js"></script>
    <script src="./js/tools.js"></script>
    <script src="./js/index.js"></script>
    <script src="./js/count.js"></script>
    <script>

        function pushData(){
            const overpay = document.querySelector('#overpay')
            const totleprice = document.querySelector('.totleprice')
            const count = document.querySelectorAll('.shu')
            let num = 0;
            for (let i = 0; i < count.length; i++) {
                const ele = count[i];
                num += parseInt(ele.innerHTML)
            }
            console.log(num);
            overpay.addEventListener('click',()=>{
                overpay.setAttribute('href','./orderconfirm.html?price='+totleprice.innerHTML+'&num='+num)
            })
        }
        pushData()

        var compute = new Count({
            msg:'.product_list .var',
            check:'.product_list .check',
            allcheck:'.finish .check',
            price:'.price',
            totleprice:'.totleprice'
        })
    </script>
</body>
</html>